<template>
  <div id="app">
    <card-modal @ok="accept" ok-text="Accept"
                :visible="popup" @cancel="cancel">
      <div class="content">
        <h1>Contract</h1>
        <p>I hereby declare I have learned how to
          install third party components in my
          own Vue project.
        </p>
      </div>
    </card-modal>
    <p v-if="signed">It appears you signed!</p>
  </div>
</template>

<script>
  import {CardModal} from 'vue-bulma-modal'
  export default {
    name: 'app',
    components: {CardModal},
    data () {
      return {
        signed: false,
        popup: true
      }
    },
    methods: {
      accept () {
        this.popup = false
        this.signed = true
      },
      cancel () {
        this.popup = false
      }
    }
  }
</script>

<style lang="sass">
  @import '~bulma';
</style>
